<template>
	<view class="pagebody">
		<view class="topbox">
			<view class=" justify-between align-center">
				<view class=" flex-row align-center">
					<image @click="backpage" src="@/static/images/login/leftjt.png" alt=""
						style="width: 48rpx;height: 48rpx;"></image>
				</view>
				<view class="bgfff searchbox justify-between align-center">
					<input class="searchinput" v-model="keyword" type="text" placeholder="搜索就诊医院"
						:placeholderStyle="placeholderStyle" />
					<image src="@/static/images/home/searchimg.png" @click="searchcase"
						style="width:48rpx ;height:48rpx ;"></image>
				</view>
			</view>
		</view>
		<view class="">
			<view v-for="(item,index) in caselist" :key="index" class="mb16"
				style="background: #FFFFFF;border-radius: 32rpx;">
				<view class="justify-between align-center"
					style="height: 100rpx;border-bottom: 1rpx solid #D7DDDC;padding: 0 24rpx;">
					<view class=" flex-row align-center">
						<view class=""
							style="margin-right:8rpx;width: 8rpx;height: 32rpx;background: #00D9B2;border-radius: 8rpx;">
						</view>
						<view class="">
							{{item.caseName}}
						</view>
					</view>
					<view class="flex-row">
						<view @click="delcase(item)" class="align-center justify-center mr25 fz28 color303b39"
							style="width: 155rpx;height: 52rpx;background: #F0F6F5;border-radius: 52rpx;">
							<image src="../../static/images/forum/delete.png"
								style="width: 24rpx;height: 28rpx;margin-right: 10rpx;" mode=""></image>删除
						</view>
						<view @click="editcase(item)" class="align-center justify-center fz28 color303b39"
							style="width: 155rpx;height: 52rpx;background: #F0F6F5;border-radius: 52rpx;">
							<image src="../../static/images/mine/editcase.png"
								style="width: 30rpx;height: 26rpx;margin-right: 10rpx;" mode=""></image>修改
						</view>
					</view>
				</view>
				<view class="" style="padding: 32rpx 24rpx;">
					<view class="flex-row">
						<view class="" style="color: #576260;font-size: 28rpx;font-weight: 500;flex-shrink: 0;">
							就诊医院:
						</view>
						<view class="color303b39 fwbold" style="margin-left: 8rpx;">
							{{item.hospital}}
						</view>
					</view>
					<view class="flex-row mt16">
						<view class="" style="color: #576260;font-size: 28rpx;font-weight: 500;flex-shrink: 0;">
							病例描述:
						</view>
						<view class="color303b39 fwbold lineclamp2" style="margin-left: 8rpx;">
							{{item.title}}
						</view>
					</view>
					<view class="flex-row mt16">
						<view class="" style="color: #576260;font-size: 28rpx;font-weight: 500;flex-shrink: 0;">
							创建时间:
						</view>
						<view class="color303b39 fwbold" style="margin-left: 8rpx;">
							{{item.caseTime}}
						</view>
					</view>
				</view>
			</view>
		</view>
		<u-modal v-model="delshow" :show-cancel-button="true" :confirm-text="'删除'" @confirm="isdelcase"
			@cancel="nodelpost" :cancel-text="'取消'" content="是否删除该病例？"></u-modal>
		<view class="addcase align-center justify-center" @click="toadd">
			<span class="align-center" style="font-size: 56rpx;height: 100%;">+</span> 新增病例
		</view>
		<FixedFoot :typeid="1"></FixedFoot>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		getcaseFilelist,
		delCase
	} from '@/api/api.js'
	import FixedFoot from '../../layouts/fixedfoot.vue';
	export default {
		components: {
			FixedFoot
		},
		onLoad() {

		},


		data() {
			return {
				placeholderStyle: "color:#7E8987;font-size:28rpx;font-weight: 400;",
				caselist: [],
				delshow: false,
				delid: 0,
				keyword: '',
			}
		},
		watch: {},
		mounted() {
			this.getcaseFilelist()

		},
		methods: {
			searchcase() {
				let data = {
					hospital: this.keyword
				}
				getcaseFilelist(data).then(res => {
					this.caselist = res.rows
				})
			},
			backpage() {
				uni.navigateBack({
					delta: 1,

				});
			},
			getcaseFilelist() {
				let data = {
					"orderByColumn":"createTime",
					"isAsc":"desc",
					"pageNum":"1",
					"pageSize":"1000"
				}
				getcaseFilelist(data).then(res => {
					this.caselist = res.rows
				})
			},
			toadd() {
				uni.navigateTo({
					url: '/pages/mine/addcase'
				})
			},
			delcase(item) {
				this.delid = item.id
				this.delshow = true;
			},
			isdelcase() {
				delCase(this.delid).then(res => {
					this.$refs.uToast.show({
						title: '病例已删除',
						type: 'success',
					})
					this.getcaseFilelist()
				})
			},
			editcase(item) {
				uni.navigateTo({
					url: '/pages/mine/addcase?id=' + item.id
				})

			}

		},

	}
</script>

<style lang="scss" scoped>
	.pagebody {
		padding-bottom: 140px;
		;
		background: #F0F6F5;

		.topbox {
			height: 128rpx;
			background: linear-gradient(180deg, rgba(0, 217, 178, 0.2) 0%, rgba(0, 217, 178, 0) 100%);
			padding: 20rpx 24rpx;

			.searchbox {
				width: 630rpx;
				height: 60rpx;
				background: #FFFFFF;
				border-radius: 60rpx;
				border: 2rpx solid rgba(0, 217, 178, 0.2);
				padding: 0 24rpx;

				.searchinput {
					font-size: 28rpx
				}

			}
		}

		.addcase {
			position: fixed;
			bottom: 72px;
			left: 0;
			right: 0;
			margin: 0 auto;
			width: 668rpx;
			height: 98rpx;
			background: #00D9B2;
			border-radius: 98rpx;
			color: #FFFFFF;
			font-size: 36rpx;
		}
	}
</style>